<template>
  <a-modal
    title="导出表结构"
    :visible="isShow"
    @ok="handleSubmit"
    :confirmLoading="confirmLoading"
    :maskClosable="false"
    @cancel="handleCancel"
    width="700px"
    :destroyOnClose="true"
  >
    <div class="single-search-item">
      <div class="item-label">选择格式：</div>
      <div class="item-content" style="margin-top:4px;">
        <a-radio-group @change="onChange" name="radioGroup">
          <a-radio :value="0">Excel</a-radio>
          <a-radio :value="1">sql</a-radio>
        </a-radio-group>
      </div>
    </div>
  </a-modal>
</template>
<script>
import { page } from "@/api";
import config from "@/config";
export default {
  data() {
    return {
      form: this.$form.createForm(this),
      confirmLoading: false,
      isShow: false,
      title: "编辑字段",
      isEdit: true,
      outObj: {},
      type: null
    };
  },
  mounted() {},
  methods: {
    show(obj) {
      confirmLoading: false;
      this.isShow = true;
      this.outObj = obj;
      this.type = null;
    },
    handleCancel() {
      this.isShow = false;
    },
    onChange(e) {
      this.type = e.target.value;
    },
    handleSubmit(e) {
      e.preventDefault();
      if (this.type === null) {
        this.$message.warning("请选择导出格式！");
        return;
      }
      this.confirmLoading = true;
      let params = Object.assign(this.outObj, { type: this.type });
      // debugger;
      page
        .tableStructureExport(params)
        .then(res => {
          if (res.data.code === -1) {
            this.$message.warning(res.data.message);
          } else {
            let url = res.data.data.filePath;
            const link = document.createElement("a");
            link.style.display = "none";
            link.href = config.fileUrl + url;
            if (this.type === 0) {
              link.setAttribute("download", "表结构导出.xls");
            } else {
              link.setAttribute("download", "表结构导出.sql");
            }
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
          }
          this.confirmLoading = false;
          this.isShow = false;
        })
        .catch(() => {
          this.isShow = false;
          this.confirmLoading = false;
          this.$message.warning("导出失败");
        });
    }
  }
};
</script>
<style scoped>
.single-search-item {
  height: 100px;
  width: 380px;
  padding: 20px 10px;
}
.item-label {
  float: left;
  width: 121px;
  text-align: right;
  line-height: 30px;
}
.item-content {
  float: left;
  width: 198px;
}
</style>
